<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>乐购商城-产品详情</title>

    <!-- 1. 重置样式 -->
    <link rel="stylesheet" href="../css/normalize.css">

    <!-- 2. 公共样式 -->
    <link rel="stylesheet" href="../css/common.css">

    <!-- 3. 当前样式 -->
    <link rel="stylesheet" href="../css/prodetail.css">

    <link rel="stylesheet" href="../lib/mf/css/magnifier.css">

    <!-- jQuery -->
    <script src="../lib/jquery.js"></script>

    <script src="../lib/mf/js/magnifier.js"></script>

    <!-- 当前js文件 -->
    <script src="../js/productdetail.js"></script>
</head>

<body style="padding-bottom : 200px">

      <!-- 头部 -->
 <div class="head ">
    <!-- 顶部 -->
    <div class="bc10">
        <div class="container clearfix cw ">
            <img class="t1" src="../image/LOGO_02.jpg" alt="">
            <a href="#" class="cw ww">legochina.cn</a>
            <span class="fr cw">欢迎光临<a href="#" class="cf67">乐购</a>,请登陆\<a href="#" class="cf67">注册</a></span>
        </div>
    </div>
    <!-- 搜索框 -->
    <div class="head-top1 clearfix container search-box">
  
        <div class="fr shop clearfix">
            <p>已有账号,请 <a href="#">登录</a></p>
        </div>
        
    </div>
    </div>


    <!--产品详情-->
    <div id="proDetail" class="proDetail container-fluid p20 bgcf3 bs">
        <p class="container">
            <a href="#">图书</a> >
            <a href="#">小说</a> >
            <a href="#">情感/家庭/婚姻</a> >
            <a href="#">博集天卷</a> >
            <a href="#">她和他</a>
        </p>
        <div class="container clearfix bgcfff p1020 bs">

            <!--放大镜-->
            <div class="fl" >
                <div class="magnifier" id="magnifier1">
                    <div class="magnifier-container">
                        <div class="images-cover"></div>
                        <!--当前图片显示容器-->
                        <div class="move-view"></div>
                        <!--跟随鼠标移动的盒子-->
                    </div>
                    <div class="magnifier-assembly">
                        <div class="magnifier-btn">
                            <span class="magnifier-btn-left">&lt;</span>
                            <span class="magnifier-btn-right">&gt;</span>
                        </div>
                        <!--按钮组-->
                        <div class="magnifier-line">
                            <ul class="clearfix animation03">
                                <li>
                                    <div class="small-img">
                                        <img src="../lib/mf/images/1.png" />
                                    </div>
                                </li>
                                <li>
                                    <div class="small-img">
                                        <img src="../lib/mf/images/2.png" />
                                    </div>
                                </li>
                                <li>
                                    <div class="small-img">
                                        <img src="../lib/mf/images/3.png" />
                                    </div>
                                </li>
                                <li>
                                    <div class="small-img">
                                        <img src="../lib/mf/images/4.png" />
                                    </div>
                                </li>
                                <li>
                                    <div class="small-img">
                                        <img src="../lib/mf/images/1.png" />
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <!--缩略图-->
                    </div>
                    <div class="magnifier-view"></div>
                    <!--经过放大的图片显示容器-->
                </div>
            </div>



            <!--图书详情-->
            <div class="fr bookdetail">
                <div class="p1020">
                    <h2 class="fs20">她和他</h2>
                    <p class="cred">《偷影子的人》作者马克·李维重磅新作，法国连续60周在榜，销量突破120万册</p>
                    <p>[法] 马克·李维 著；杨亦雨 译</p>
                </div>
                <div class="bgcccc p1020 priceDel">
                    <p>
                        <span>乐 购 价：</span>
                        <span class="cred f20">&yen;26.20</span> <span>[6.9折] </span>
                        <span>[定价：￥38.00]</span>
                        <span>(降价通知)</span>
                    </p>
                    <p>
                        <span>促销信息：</span>
                        <span class="cred f12">满减 每满150.00元，可减50.00元现金</span>
                        <a href="#">详情 >></a>
                    </p>
                    <p>
                        <span>领 券：</span>
                        <i class="cf67">100-6</i>
                        <i class="cf67">200-50</i>
                    </p>
                    <p class="evaluation">
                        <span>累计评价</span>
                        <span class="cf60">9999</span>
                    </p>
                </div>
                <p class="p1020 catCheck">
                    <span>种类选择：</span>
                    <b>平装版</b>
                    <b>精装版</b>
                    <b>豪华版</b>
                    <b>豪华版plus</b>
                </p>

                <div class="clearfix p1020 mt30">
                    <div class="proNum fl">
                        <input type="text" value="1">
                        <a id="addNum">+</a>
                        <a id="reNum">-</a>
                    </div>
                    <p class="addCar fl"><a class="cfff" href="#">加入到购物车</a></p>
                </div>
            </div>


        </div>
    </div>


    <div class="guess container clearfix">
        <div class="guess-title">
          <div class=" pro-title clearfix">
              <div class="home1-title fl">人气单品</div>
         </div>
         
      </div>
      <div class="oo fl clearfix">
        <img src="../image/22935553-1_l.jpg" alt="">
        <img src="../image/1111.png" alt="">
        <p>白夜行  东野上吾</p>
        <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
        <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
      </div>
      <div class="oo fl">
        <img src="../image/22935553-1_l.jpg" alt="">
        <img src="../image/1111.png" alt="">
        <p>白夜行  东野上吾</p>
        <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
        <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
      </div>
      <div class="oo fl">
        <img src="../image/22935553-1_l.jpg" alt="">
        <img src="../image/1111.png" alt="">
        <p>白夜行  东野上吾</p>
        <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
        <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
      </div>
      <div class="oo fl ">
        <img src="../image/22935553-1_l.jpg" alt="">
        <img src="../image/1111.png" alt="">
        <p>白夜行  东野上吾</p>
        <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
        <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
      </div>
      <div class="oo fl ">
        <img src="../image/22935553-1_l.jpg" alt="">
        <img src="../image/1111.png" alt="">
        <p>白夜行  东野上吾</p>
        <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
        <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
      </div>
      </div>
      <div class="container clearfix">
        <div class="pro1  clearfix fl">
            <div><p class="kan">看了又看</p></div>
            <div class="oo fl ">
                <img src="../image/22935553-1_l.jpg" alt="">
                <img src="../image/1111.png" alt="">
                <p>白夜行  东野上吾</p>
                <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
                <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
              </div><div class="oo fl ">
                <img src="../image/22935553-1_l.jpg" alt="">
                <img src="../image/1111.png" alt="">
                <p>白夜行  东野上吾</p>
                <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
                <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
              </div><div class="oo fl ">
                <img src="../image/22935553-1_l.jpg" alt="">
                <img src="../image/1111.png" alt="">
                <p>白夜行  东野上吾</p>
                <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
                <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
              </div><div class="oo fl ">
                <img src="../image/22935553-1_l.jpg" alt="">
                <img src="../image/1111.png" alt="">
                <p>白夜行  东野上吾</p>
                <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
                <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
              </div><div class="oo fl ">
                <img src="../image/22935553-1_l.jpg" alt="">
                <img src="../image/1111.png" alt="">
                <p>白夜行  东野上吾</p>
                <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
                <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
              </div><div class="oo fl ">
                <img src="../image/22935553-1_l.jpg" alt="">
                <img src="../image/1111.png" alt="">
                <p>白夜行  东野上吾</p>
                <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
                <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
              </div><div class="oo fl ">
                <img src="../image/22935553-1_l.jpg" alt="">
                <img src="../image/1111.png" alt="">
                <p>白夜行  东野上吾</p>
                <p>推荐: <img src="../image/xx_03.png" alt=""> </p>
                <p><span class="cred f24">￥:38</span><del class="f24">￥:58</del></p>
              </div>
        </div>
        <div class="fl  hahah" style="width: 810px;height: 500px;">
            <div class="guess container clearfix">
                <div class="guess-title1">
                  <div class=" pro-title clearfix">
                      <div class="jies fl">商品介绍</div>
                      <div class="home1-title fl">评论(9999)</div>
                 </div> 
        </div>
        <div class="picture">
            <img src="../image/222.PNG" alt="">
        </div>
        <div class="pinl">
            <span class="cred">全部评价(9999)</span>
            <span>好评(888)</span>
            <span>中评(888)</span>
            <span>差评(888)</span>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        <div class="clearfix clearfix w8">
            <div class="plle fl">
                <img src="../image/xx_03.png" alt="">
                <p>下单后5天评论</p>
                <p>2016-08-01</p>
            </div>
            <div class="plzj fl">
                <p>书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                    键是价格真给力</p>
            </div>
            <div class="plri">
               <div class="clearfix">
                <img class="fl" src="../image/index27_14.jpg" alt="">
                <p class="fl">哈哈哈</p>
                <p>金牌会员</p>
                <p>来自iPhone客户端</p>
               
               </div>
            </div>
        </div>
        
        
    </div>
</body>

</html>